<style scoped>
    .spare-order-page{}

</style>
<template> 
    <div class="spare-order-page">
        <el-form :inline="true" :model="queryPOForm" ref="queryPOForm" class="demo-form-inline" style="border-bottom:1px solid #ccc;">
            <el-form-item label="法人名称" class="selectMB10">
                <el-input size="mini" v-model="queryPOForm.legalPersonName" v-if="legalPersonDropDown.length == 1" disabled placeholder=""></el-input>
                  <el-select size="mini" clearable  v-model="queryPOForm.legalPersonName" v-else placeholder="请选择" @change="changeLegalPerson">
                    <el-option v-for="(legalPerson,index) in legalPersonDropDown" :key="index" :label="legalPerson.legalPersonName" :value="legalPerson.id">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="订单编号" class="selectMB10">
                <el-input size="mini" v-model="queryPOForm.prOrderCode" placeholder="请输入PO编号"></el-input>
            </el-form-item>
            <el-form-item label="制单日期" class="selectMB10">
                <el-date-picker type="date" size="mini" :editable="false" v-model="queryPOForm.createTimeStart"  @change="selectedCreateTimeStart" placeholder="请选择"></el-date-picker>
                &nbsp;至&nbsp;
                <el-date-picker type="date" size="mini" :editable="false" v-model="queryPOForm.createTimeEnd" @change="selectedCreateTimeEnd" placeholder="请选择"></el-date-picker>
            </el-form-item>
             <el-form-item label="订单状态" class="selectMB10">
                <el-select size="mini" clearable v-model="queryPOForm.procurementOrderStatus" placeholder="请选择" >
                    <el-option v-for="(procurementOrderStatus,index) in selectDropdown.procurementOrderStatus" :key="index" :label="procurementOrderStatus.label" :value="procurementOrderStatus.value"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="集成状态" class="selectMB10">
                <el-select size="mini" clearable v-model="queryPOForm.procurementOrderStatusResult" placeholder="请选择" >
                    <el-option v-for="(procurementOrderStatusResult,index) in selectDropdown.procurementOrderStatusResult" :key="index" :label="procurementOrderStatusResult.label" :value="procurementOrderStatusResult.value"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="采购类别" class="selectMB10">
                <el-select size="mini" clearable v-model="queryPOForm.procurementCategory" placeholder="请选择" >
                    <el-option v-for="(procurementCategory,index) in selectDropdown.procurementCategory" :key="index" :label="procurementCategory.label" :value="procurementCategory.value"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="期望到货日期" class="selectMB10">
                <el-date-picker type="date" size="mini" :editable="false" v-model="queryPOForm.expectTimeStart"  @change="selectedExpectTimeStart" placeholder="请选择"></el-date-picker>
                &nbsp;至&nbsp;
                <el-date-picker type="date" size="mini" :editable="false" v-model="queryPOForm.expectTimeEnd" @change="selectedExpectTimeEnd" placeholder="请选择"></el-date-picker>
            </el-form-item>
            <el-form-item label="紧急程度" class="selectMB10">
                <el-select size="mini" clearable v-model="queryPOForm.emergencyDegree" placeholder="请选择">
                    <el-option v-for="(procurementEmergencyDegree,index) in selectDropdown.procurementEmergencyDegree" :key="index" :label="procurementEmergencyDegree.label" :value="procurementEmergencyDegree.value"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="供应商编码" class="selectMB10">
                <!-- 
                <el-select size="mini" clearable  v-model="queryPOForm.vendor" placeholder="请选择" prop="supplierName">
                    <el-option v-for="vendor in queryPOForm.supplierDropdown" :label="vendor.partnerName" :value="vendor.partnerCode"></el-option>
                </el-select>
                -->
                <el-input size="mini" v-model="queryPOForm.partnerCode" placeholder="请输入供应商编码"></el-input>
            </el-form-item>
            <el-form-item label="供应商名称" class="selectMB10">
                <el-input size="mini" v-model="queryPOForm.partnerName" placeholder="请输入供应商名称"></el-input>
            </el-form-item>
            <el-form-item class="selectMB10">
                <el-button class="bolder outsideBtnBS selectAll" :disabled="selectDisabled" size="mini" type="danger" @click="queryPOSheet()">查询</el-button>
            </el-form-item>
        </el-form>
        <!--表格-->
        <label class="default-label">PO清单：</label>
        <!--创建询价单按钮-->
        <el-button class="bolder outsideBtnBS" size="mini" type="danger" v-if="powerFlag1">导出</el-button>
        <el-table :data="POSheetData" id="inquirySheet" border style="width: 100%;" v-loading.body="loading" element-loading-text="拼命加载中" :default-sort = "{prop: 'date', order: 'descending'}">
            <el-table-column  type="index" header-align="center" align="center" label="序"  width="40"></el-table-column>
            <el-table-column  label="操作" header-align="center" align="center" width="260">
                <template scope="scope">
                    <span v-if="powerFlag1">
                        <div class="operationItem bolder" v-if="scope.row.status == 'LOCAL_SAVED' || scope.row.status == 'SAVED_IG_NO' ||scope.row.status == 'REVIEW_IG_FAIL' ||scope.row.status == 'EXAMINE_IG_FAIL' ||scope.row.status == 'EXAMINE_REJECTED' ||scope.row.status == 'REVIEW_REJECTED'" @click="handleUpdate(scope.$index,scope.row)">修改</div>
                        <div class="operationItem bolder disabled" v-else >修改</div>
                    </span>
                    <span v-if="powerFlag2">
                         <div class="operationItem bolder" v-if="scope.row.status == 'SUBMITTED_IG_SUCCEED'" @click="handleExamine(scope.$index,scope.row)">审核</div>
                         <div class="operationItem bolder disabled" v-else >审核</div>
                    </span>
                    <span v-if="powerFlag3">
                        <div class="operationItem bolder" v-if="scope.row.status == 'REVIEW_APPROVED_IG_SUCCEED'" @click="handleApproval(scope.$index,scope.row)">审批</div>
                        <div class="operationItem bolder disabled" v-else >审批</div>
                    </span>
                    <!-- 
                    <span>
                        <div class="operationItem bolder" v-if="scope.row.status == 'EXAMINE_YES_IG_SUCCEED'" @click="handlePrint(scope.$index,scope.row)">打印</div>
                        <div class="operationItem bolder disabled" v-else >打印</div>
                    </span>
                    -->
                    <span v-if="powerFlag4">
                         <div class="operationItem bolder" v-if="scope.row.status == 'REVIEW_IG_FAIL' ||  scope.row.status == 'EXAMINE_IG_FAIL' ||scope.row.status == 'EXAMINE_REJECTED' || scope.row.status == 'REVIEW_REJECTED' || scope.row.status == 'SAVED_IG_NO' || scope.row.status == 'LOCAL_SAVED'" @click="handleVoid(scope.$index,scope.row)">作废</div>
                         <div class="operationItem bolder disabled" v-else >作废</div>
                    </span>
                    <router-link :to="{ path: 'SeePO', query: { prOrderCode: scope.row.prOrderCode}}"  class="operationItem bolder">查看</router-link> <!-- ,seeFlag:true -->
                </template>
            </el-table-column>
            <el-table-column prop="prOrderCode" label="PO编号" header-align="center" show-overflow-tooltip></el-table-column>
            <el-table-column prop="sapCode" label="SAP编号" header-align="center" width="100" show-overflow-tooltip></el-table-column>
            <el-table-column prop="partnerName" label="供应商名称" header-align="center" show-overflow-tooltip></el-table-column>
            <el-table-column prop="procurementCategory" label="采购类别" header-align="center" width="100" show-overflow-tooltip></el-table-column>
            <el-table-column prop="expectTime" label="期望到货日期" header-align="center" width="100" show-overflow-tooltip></el-table-column>
            <el-table-column prop="currency" label="币别" header-align="center" show-overflow-tooltip></el-table-column>
            <el-table-column prop="totalMoney" label="总金额" header-align="center" align="right"></el-table-column>
            <el-table-column prop="currencyTotalMoney" label="本币总金额" header-align="center" align="right"></el-table-column>
            <el-table-column prop="emergencyDegree" label="紧急程度" header-align="center" show-overflow-tooltip></el-table-column>
            <!-- -->
            <el-table-column prop="poStatusKV.label" label="订单状态" header-align="center" show-overflow-tooltip></el-table-column>
            <el-table-column prop="integrateStatusKV.label" label="集成状态" header-align="center" show-overflow-tooltip></el-table-column>
            <el-table-column prop="creatorName" label="操作人" header-align="center" show-overflow-tooltip></el-table-column>
            <el-table-column prop="createTime" label="制单时间" header-align="center" show-overflow-tooltip></el-table-column>
            <el-table-column prop="reviewer" label="审核人" header-align="center" show-overflow-tooltip></el-table-column>
            <el-table-column prop="reviewOpinions" label="审核意见" header-align="center" show-overflow-tooltip></el-table-column>
            <el-table-column prop="reviewTime" label="审核时间" header-align="center" show-overflow-tooltip></el-table-column>
            <el-table-column prop="examiner" label="审批人" header-align="center" show-overflow-tooltip></el-table-column>
            <el-table-column prop="examineOpinions" label="审批意见" header-align="center" show-overflow-tooltip></el-table-column>
            <el-table-column prop="examineTime" label="审批时间" header-align="center" show-overflow-tooltip></el-table-column>
        </el-table>
        <!--分页-->
        <el-pagination v-if="isPaging" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pageIndex"  :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :page-count="totalPage" :total="totalNumber"></el-pagination>
    </div>
</template>

<script>
       export default {
        data() {
            return {
                // 查询表单
                queryPOForm:{
                    legalPersonCode:"",
                    legalPersonName:"",
                    legalPersonId:"",
                    prOrderCode:"",
                    createTimeStart:"",
                    createTimeEnd:"",
                    // status:"",
                    procurementCategory:"",  //采购类别
                    expectTimeStart:"",
                    expectTimeEnd:"",
                    emergencyDegree:'',   //紧急程度
                    procurementOrderStatus:null,  //订单状态
                    procurementOrderStatusResult:null,  //集成状态
                    partnerCode:"",
                    partnerName:""
                },
                loading:false,
                disabled:false,
                POSheetData: [],// PO清单
                legalPersonDropDown:[], //法人名称
                supplierNameDropDown:[], //供应商名称
                selectDropdown:[],     //查询下拉菜单


                // 分页
                pageIndex:1,    //当前页（必传）
                pageSize :10,   //每页多少条
                totalNumber: 20,
                totalPage:2,
                isPaging:false,
                // orderStatus:"",    //询价单状态   为50时，已作废
                //权限
                powerFlag1:false,
                powerFlag2:false,
                powerFlag3:false,
                powerFlag4:false,
                //查询禁用
                selectDisabled:false
            };
        },
        computed:{
            powerData(){
                return this.$store.state.powerData;
            }
        },
        watch:{
            powerData(){
                var _this = this;
                for(var i=0;i<_this.powerData.length;i++){
                    if(_this.powerData[i]=="ROLE_security_materialOrder_modify"){
                        //备件订单修改、保存、提交及导出权限
                        _this.powerFlag1=true;
                    }
                    if(_this.powerData[i]=="ROLE_security_materialOrder_review"){
                        //备件订单审核权限
                        _this.powerFlag2=true;
                    }
                    if(_this.powerData[i]=="ROLE_security_materialOrder_approve"){
                        //备件订单审批权限
                        _this.powerFlag3=true;
                    }
                    if(_this.powerData[i]=="ROLE_security_materialOrder_abolish"){
                        //备件订单作废权限
                        _this.powerFlag4=true;
                    }
                }
            }    
        },
        //进入页面立即运行此方法
        mounted: function () {
            var _this = this;
            _this.$store.commit('currentActive', 'SpareOrder');
        //    //ajax前后查询按钮禁用
        //    $(".selectAll").ajaxStart(function(){
        //        _this.selectDisabled=true;
        //    });
        //    $(".selectAll").ajaxStop(function(){
        //        _this.selectDisabled=false;
        //    });

            _this.legalPersonDropDownValue(); //法人名称下拉列表值
            _this.spareOrderDropdownValue();  //询价类型和询价状态下拉列表
            _this.queryPOSheet();    //表单查询
           //判断权限
           for(var i=0;i<_this.powerData.length;i++){
               if(_this.powerData[i]=="ROLE_security_materialOrder_modify"){
                   //备件订单修改、保存、提交及导出权限
                   _this.powerFlag1=true;
               }
               if(_this.powerData[i]=="ROLE_security_materialOrder_review"){
                   //备件订单审核权限
                   _this.powerFlag2=true;
               }
               if(_this.powerData[i]=="ROLE_security_materialOrder_approve"){
                   //备件订单审批权限
                   _this.powerFlag3=true;
               }
               if(_this.powerData[i]=="ROLE_security_materialOrder_abolish"){
                   //备件订单作废权限
                   _this.powerFlag4=true;
               }
           }
       },
        methods: {
            // 制单日期格式化
            selectedCreateTimeStart(val){
                var _this=this;
                _this.queryPOForm.createTimeStart=val;
                if(_this.queryPOForm.createTimeEnd && val >= _this.queryPOForm.createTimeEnd){
                    _this.common.errorTip("制单有效日期不能大于等于制单失效日期！");
                    _this.queryPOForm.createTimeStart ="";
                }
            },
            selectedCreateTimeEnd(val){
                var _this=this;
                _this.queryPOForm.createTimeEnd=val;
                if(_this.queryPOForm.createTimeStart && val <= _this.queryPOForm.createTimeStart){
                    _this.common.errorTip("制单失效日期不能小于等于制单有效日期！");
                    _this.queryPOForm.createTimeEnd ="";
                }
            },
            // 期望到货日期格式化
            selectedExpectTimeStart(val){
                var _this=this;
                _this.queryPOForm.expectTimeStart=val;
                if(_this.queryPOForm.expectTimeEnd && val >= _this.queryPOForm.expectTimeEnd){
                    _this.common.errorTip("期望到货起始日期不能大于等于期望到货结束日期！");
                    _this.queryPOForm.expectTimeStart ="";
                }
            },
            selectedExpectTimeEnd(val){
                var _this=this;
                _this.queryPOForm.expectTimeEnd=val;
                if(_this.queryPOForm.expectTimeStart && val <= _this.queryPOForm.expectTimeStart){
                    _this.common.errorTip("期望到货结束日期不能小于等于期望到货起始日期！");
                    _this.queryPOForm.expectTimeEnd ="";
                }
            },
            //法人名称下拉列表值
            legalPersonDropDownValue(){  
                var _this = this;
                $.ajax({
                    type:'GET',
                    url:_this.procurement_service+"legalPerson/ofCurrentUser",
                    cache:false,
                    success:function(data){
                        if(data.success){
                            _this.legalPersonDropDown = data.data;
                            if(_this.legalPersonDropDown.length==1){
                                _this.queryPOForm.legalPersonId=_this.legalPersonDropDown[0].id;
                                _this.queryPOForm.legalPersonName=_this.legalPersonDropDown[0].legalPersonName;
                                _this.dropdownValue();
                            }
                        }else{
                            _this.common.errorTip(data.errorMessage);
                        }
                    }
                })
            },
            // 选择法人 取id、legalPersonCode
            changeLegalPerson(){
                var _this = this;
                for(var i=0;i<_this.legalPersonDropDown.length;i++){
                    if(_this.queryPOForm.legalPersonName==_this.legalPersonDropDown[i].id){
                        _this.queryPOForm.legalPersonId=_this.legalPersonDropDown[i].id;
                        _this.queryPOForm.legalPersonCode=_this.legalPersonDropDown[i].legalPersonCode;
                    }
                }
               _this.dropdownValue();
            },
            //供应商下拉列表值
            dropdownValue(){  
                var _this=this;
                $.ajax({
                    type:'GET',
                    url:_this.metadata_service+"partner/queryByLegalPerson?legalPersonId="+_this.queryPOForm.legalPersonId,
                    cache:false,
                    success:function(data){
                        if(data.success){
                            _this.queryPOForm.supplierDropdown=data.data;
                        }else{
                            _this.common.errorTip(data.errorMessage);
                        }
                    }
                })
            },
            //紧急状态、采购类别、PO状态
            spareOrderDropdownValue(){  
                var _this = this;
                var tmp=["procurementCategory","procurementEmergencyDegree","procurementOrderStatus","procurementOrderStatusResult"];
                $.ajax({
                    type:'POST',
                    url:_this.procurement_service+'procurement/getPullDownList',
                    cache:false,
                    data:JSON.stringify(tmp),
                    dataType:'JSON',
                    contentType:"application/json;charset=utf-8",
                    success:function(data){
                        if(data.success){
                            _this.selectDropdown=data.data;
                        }else{
                            _this.common.errorTip(data.errorMessage);
                        }
                    }
                })
            },

            // 查询按钮   查询询价清单
            queryPOSheet(){
                var _this=this;
                _this.loading=true;
                if(_this.queryPOForm.procurementOrderStatus == ''){
                    _this.queryPOForm.procurementOrderStatus = null;
                }
                if(_this.queryPOForm.procurementOrderStatusResult == ''){
                    _this.queryPOForm.procurementOrderStatusResult = null;
                }
                var tmp={
                    legalPersonCode:_this.queryPOForm.legalPersonCode, //法人代码
                    prOrderCode:_this.queryPOForm.prOrderCode, //PO编号
                    createTimeStart:_this.queryPOForm.createTimeStart,  //制定时间
                    createTimeEnd:_this.queryPOForm.createTimeEnd,//制定时间
                    poStatusQueryName:_this.queryPOForm.procurementOrderStatus,  //订单状态
                    poStatusQueryResultName:_this.queryPOForm.procurementOrderStatusResult,   //集成状态
                    procurementCategory:_this.queryPOForm.procurementCategory,//采购类别
                    expectTimeStart:_this.queryPOForm.expectTimeStart,  //期望到货时间
                    expectTimeEnd:_this.queryPOForm.expectTimeEnd, //紧急程度
                    emergencyDegree:_this.queryPOForm.emergencyDegree, //供应商编码
                    partnerName:_this.queryPOForm.partnerName, //供应商名称
                    pageIndex:_this.pageIndex,
                    pageSize:_this.pageSize
                };
                _this.selectDisabled=true;
                $.ajax({
                    type: 'POST',
                    url: _this.procurement_service+"procurementOrder/search",
                    cache: false,
                    data:JSON.stringify(tmp),
                    dataType:'JSON',
                    contentType: "application/json;charset=utf-8",
                    success: function (data) {
                        if (data.success) {
                            _this.loading=false;
                            _this.isPaging=true;
                            _this.totalPage=data.data.totalPage;
                            _this.totalNumber=data.data.totalNumber;
                            var arr=data.data.dataList;
                            //金额保留两位
                            for(var i=0;i<arr.length;i++){
                                if(arr[i].totalMoney!=null){
                                    arr[i].totalMoney=arr[i].totalMoney.toFixed(2);
                                }
                                if(arr[i].currencyTotalMoney!=null){
                                    arr[i].currencyTotalMoney=arr[i].currencyTotalMoney.toFixed(2);
                                }

                            }
                            _this.POSheetData=arr;
                        }else{
                            _this.common.errorTip(data.errorMessage)
                        }
                        _this.selectDisabled=false;
                    }
                });
            },
            
            // 每行的修改按钮
            handleEdit(index,row){
                console.log(index,row);
            },

            //   分页
            handleSizeChange(val) {
                // console.log(`每页 ${val} 条`);
                var _this=this;
                _this.pageSize=val;
                _this.queryPOSheet();

            },
            //点击页码分页查询点击事件
            handleCurrentChange(val) {
                // console.log(`当前页: ${val}`);
                var _this=this;
                _this.pageIndex=val;
                _this.queryPOSheet();
            },
            // 修改按钮  判断能否修改
            handleUpdate(index,row){
                var _this=this;
                // $.ajax({
                //     type: 'POST',
                //     url: _this.procurement_service+"procurementOrder/enableUpdate?prOrderCode=" + row.prOrderCode,
                //     cache: false,
                //     // data:JSON.stringify(tmp),
                //     dataType:'JSON',
                //     contentType: "application/json;charset=utf-8",
                //     success: function (data) {
                //         if (data.success) {
                //             if(data.data.enable){
                                _this.$router.push({path:"/ChangePO",query:{prOrderCode:row.prOrderCode}});
                    //         }else{
                    //             _this.common.errorTip(data.errorMessage);
                    //         }
                    //     }else{
                    //         _this.common.errorTip(data.errorMessage)
                    //     }
                    // }
                // });
            },
            // 审核按钮
            handleExamine(index,row){
                var _this=this;
                _this.$router.push({path:"/SeePO",query:{prOrderCode:row.prOrderCode}});
            },
            // 审批按钮
            handleApproval(index,row){
                var _this=this;
                _this.$router.push({path:"/SeePO",query:{prOrderCode:row.prOrderCode}});
            },
            // // 打印按钮
            // handlePrint(index,row){
            //     var _this=this;
            //     _this.$router.push({path:"/SeePO",query:{prOrderCode:row.prOrderCode}});
            // },
            // 作废按钮
            handleVoid(index,row){
                var _this=this;
                _this.$router.push({path:"/SeePO",query:{prOrderCode:row.prOrderCode}});
            },
            // // ===================================
            // successTip(p) {     //成功时的提示信息
            //     this.$notify({
            //         title: '成功',
            //         message: p,
            //         type: 'success'
            //     });
            // },
            // errorTip(p) {     //错误提示
            //     this.$notify.error({
            //         title: '错误',
            //         message: p
            //     });
            // }

        }
    }
</script>



